<template>
    <!-- 销售收入 -->
  <div class="salesRevenue">
    <div class="head">
    <p>销售收入</p>

    </div>
    <div class="content">
      <div class="echarts">
                  <Echarts :echartsData="echartsData" :idName="'salesRevenue'"></Echarts>
      </div>
    <div class="salesType" style="display:flex;justify-content: space-around;text-align:center">
      <div v-for="(item,index) in revenueData" :key="index">

       <p>{{item.name}}</p>
      <p>{{item.data.toLocaleString()}}</p>
      <p>+45% 同比增长</p>

      </div>

    </div>
    </div>
  </div>
</template>

<script>
import Echarts from '../../components/echarts.vue'
export default {
components:{
    Echarts,

},
data(){
    return {
echartsData:{
  xAxisData: ['1月', '2月', '3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
  series: [
             {
               name: 'APP',
               type: 'bar',
               data: [ 500, 102, 101, 134, 160, 200, 200,32,204,204,240,234]
             },
             {
               name: '微信端',
               type: 'bar',
               data: [ 190, 105, 131, 134, 160, 200, 200,32,204,214,10,243]
               }
           ]
},

      revenueData:[
  {
  name:"总收入",
  data:342342
},
{
  name:"线上收入",
  data:342342
},
{
  name:"线下收入",
  data:342342
}
      ],

//     option : {
 
//          tooltip: {
//              trigger: 'axis'
//            },
//            calculable: true,
//            xAxis: [
//              {
//                type: 'category',
//                // prettier-ignore
//                data: ['1月', '2月', '3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
//                axisTick: {
//                alignWithLabel: true
//              },
//              nameGap:25
//              }
//            ],
//            yAxis: [
//              {
//                type: 'value',
//                axisLine: {
//                  show: false //不显示坐标轴线
//                  },
//                  axisTick:{
//                   show:false
//                  }
               
//              }
//            ],
//            series: [
//              {
//                name: 'APP',
//                type: 'bar',
//                data: [ 500, 102, 101, 134, 160, 200, 200,32,204,204,240,234]
//              },
//              {
//                name: '微信端',
//                type: 'bar',
//                data: [ 190, 105, 131, 134, 160, 200, 200,32,204,214,10,243]
//                }
//            ]
// }

    }
}
}
</script>

<style>

</style>